<template>
	<view class="login">
		<div class="login_big_tit">生涯大平台</div>
		<div class="login_small_tit">让您的管理如游戏般简单</div>
		<div class="box1"><up-button text="账号密码登录" color="linear-gradient(to right, #93D2F3, #4095E5 100%)"
				class="login_btn1" @tap="GoLogin"></up-button></div>
		<div class="box2"><up-button text="验证码登录" color="linear-gradient(to right, #93D2F3, #4095E5 100%)"
				class="login_btn1" @tap="GoCodeLogin"></up-button></div>
		<up-checkbox :customStyle="{ marginBottom: '8px' }" shape="circle" name="agree" usedAlone
			v-model:checked="aloneChecked" class="article">
			<template #label>
				<div class="art-text"> 我已阅读并同意生涯大平台的<span style="color: rgba(64,149,229,1);" @tap="uni.navigateTo({url:'/pages/Service/Service'})">《用户协议》</span>与<span

						style="color: rgba(64,149,229,1);" @tap="uni.navigateTo({url:'/pages/Privacy/Privacy'})">《隐私政策》</span></div>

			</template>
		</up-checkbox>
		<image src="/static/images/logo.png" alt="生涯大平台logo" class="logo"  > </image>
		<up-toast ref="uToastRef"></up-toast>
	</view>

	<up-modal :show="showModal" title="用户协议及隐私政策" style="font-size: 32rpx;">
		<template #default>
			<div>
				亲爱的用户，感谢您信任并使用生涯大平台。我们依据相关法律法规规定了<span style="color:#FE8939" @tap="uni.navigateTo({url:'/pages/Service/Service'})">《服务协议》</span>和<span style="color:#FE8939" @tap="uni.navigateTo({url:'/pages/Privacy/Privacy'})">《隐私政策》</span>
				以便您了解我们收集、使用、存储和共享个人信息的情况，如您点击同意，则代表充分理解相关条款的内容。您可以“我的-”页面再次查看本政策。
			</div>

		</template>
		<template #confirmButton>
			<div style="display: flex;justify-content: space-around;">
				<div @tap="showModal = false">拒绝</div>
				<!-- <div style="color: #FE8939" @tap="showModal = false; aloneChecked = true">同意并使用</div> -->
				<div style="color: #FE8939" @tap="agreeAndUse">同意并使用</div>

			</div>

		</template>

	</up-modal>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { getUserInfoHandle } from '../../utils/user'
const aloneChecked = ref(false)
// const aloneChecked = ref(uni.getStorageSync('agreedPolicy') || false)
const uToastRef = ref(null)
// const showModal = ref(true)
const showModal = ref(false)
const GoLogin = () => {
	if (aloneChecked.value) {
		uni.navigateTo({
			url: '/pages/accountLogin/accountLogin'
		})
	} else {
		showModal.value = true
	}
}

const GoCodeLogin = () => {
	if (aloneChecked.value) {
		uni.navigateTo({
			url: '/pages/codeLogin/codeLogin'
		})
	} else {
		showModal.value = true
	}
}

// 同意按钮逻辑修改
const agreeAndUse = () => {
  showModal.value = false
  aloneChecked.value = true
  // 保存到本地存储，永久记录已同意
  uni.setStorageSync('agreedPolicy', true)
}

// 在页面挂载时检查token是否有效
onMounted(() => {
	checkTokenValidity()
	 // 如果从未同意过，才显示弹窗
	  if (!uni.getStorageSync('agreedPolicy')) {
	    showModal.value = true
	  }
})

// 检查token有效性函数
const checkTokenValidity = async () => {
	try {
		const token = uni.getStorageSync('token')
		if (!token) {
			// 没有token，保持在登录页面
			return
		}

		// 调用接口验证token
		const res = await getUserInfoHandle()
		if (res.code === 200) {
			// token有效，跳转到首页
			uni.switchTab({
				url: '/pages/workbenches/workbenches'
			})
		} else {
			// token无效，清除token
			uni.removeStorageSync('token')
		}
	} catch (error) {
		console.error('验证token失败:', error)
		// 发生错误，清除token
		uni.removeStorageSync('token')
	}
}
</script>

<style lang="scss">
@font-face {
	font-family: 'MyCustomFont';
	src: url('../../assets/font/YouSheBiaoTiHei-2.ttf') format('truetype');
}

.login {
	width: 100%;
	height: 100vh;
	position: relative;

	.login_big_tit {
		position: absolute;
		top: 392rpx;
		width: 100%;
		display: flex;
		justify-content: center;
		color: rgba(154, 154, 154, 1);
		font-size: 48px;

		font-family: 'MyCustomFont', sans-serif;
	}

	.login_small_tit {
		position: absolute;
		top: 506rpx;
		width: 100%;
		display: flex;
		justify-content: center;
		color: rgba(64, 149, 229, 1);
		font-size: 28rpx;
		text-align: left;
		font-family: PingFangSC-regular;
	}

	.box1 {
		width: 100%;
		display: flex;
		justify-content: center;
		position: absolute;
		top: 768rpx;
	}

	.box2 {
		width: 100%;
		display: flex;
		justify-content: center;
		position: absolute;
		top: 880rpx;
	}

	.login_btn1 {
		width: 638rpx;
		height: 82rpx;
		line-height: 44rpx;
		border-radius: 8rpx;
		background: linear-gradient(88.71deg, rgba(147, 210, 243, 1) 15.3%, rgba(64, 149, 229, 1) 74.51%);
		color: rgba(255, 255, 255, 1);
		font-size: 30rpx;
		text-align: center;
		box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(206, 206, 206, 0.37);
		font-family: -regular;
	}

	.article {
		position: absolute;
		top: 1004rpx;
		left: 48rpx;
	}

	.art-text {
		width: 608rpx;
		height: 90rpx;
		line-height: 34rpx;
		color: rgba(16, 16, 16, 1);
		font-size: 24rpx;
		text-align: left;
		font-family: PingFangSC-regular;
		padding-top: 24rpx;
		box-sizing: border-box;
	}

	.logo {
		position: absolute;
		left: 300rpx;
		bottom: 82rpx;
		width: 144rpx;
		height: 144rpx;
		image-rendering: -webkit-optimize-contrast;
		image-rendering: pixelated;
	}
}
</style>